import React, {useEffect, useRef, useState} from "react";
import {addroom, EditBuilder, editroom, getRoBusex} from "../../../../api/api.js";
import {Button, Col, Form, Modal, Row, Toast} from "@douyinfe/semi-ui";
import {IconPlus} from "@douyinfe/semi-icons";

function Room_EForm(props) {
    const [visible, setVisible] = useState(false);
    const [list5,setlist5] = useState([]);

    useEffect(()=>{
        setTimeout(() => {
            if (api.current) {
                api.current.setValue("rid", props.mess[0].rid);
            }
        }, 0);
    },[visible])

    async function edit(){
        let form = new FormData()
        form.append("lid",api.current.getValues().lid)
        form.append("specification",api.current.getValues().specification)
        form.append("rid",api.current.getValues().rid)
        form.append("type",api.current.getValues().type)
        form.append("isable",api.current.getValues().ison)
        form.append("id",props.mess[0].id)
        const res = await editroom(form)
        if (res.data.code==200){
            Toast.success('寝室修改成功')
            handleOk()
        }else {
            Toast.success('寝室修改失败')
            handleOk()
        }
    }
    function valte() {
        api.current.validate()
            .then(values=>{
                edit()
            })
            .catch(errors=>{
                Toast.error("请重新填写表单")
            })
    }

    const showDialog = () => {
        setVisible(true);
    };
    const handleOk = () => {
        setVisible(false);
    };
    const handleCancel = () => {
        setVisible(false);
    };
    const handleAfterClose = () => {
    };
    const childRef = useRef();
    const list = [
        { value: '0', label: '女生寝室楼', otherKey: 0 },
        { value: '1', label: '男生寝室楼', otherKey: 3 },
    ];
    const list6 = [
        { value: '0', label: '不启用', otherKey: 0 },
        { value: '1', label: '启用', otherKey: 3 },
    ];
    const list2 = [
        { value: '4', label: '四人寝', otherKey: 0 },
        { value: '6', label: '六人寝', otherKey: 3 },
        { value: '8', label: '八人寝', otherKey: 3 },
    ];
    const list4 = [
        { value: '1', label: '寝室', otherKey: 0 },
        { value: '2', label: '淋浴间', otherKey: 3 },
        { value: '3', label: '水房', otherKey: 3 },
        { value: '4', label: '洗手间', otherKey: 3 },
        { value: '5', label: '杂物间', otherKey: 3 },
        { value: '6', label: '其他', otherKey: 3 },

    ];
    const api = useRef();
    async function getsexinfo(v) {
        const res = await getRoBusex(v)
        console.log(res)
        setlist5(res.data.data)
    }

    return (
        <>
            <Button onClick={showDialog}  icon={<IconPlus />} theme="solid" style={{ marginRight: 10 }}>修改寝室楼</Button>
            <Modal
                okText={'Sounds great!'}
                style={{width:"30%",height:"49%"}}
                title={<div><IconPlus  style={{marginRight:"10px"}} />修改寝室楼</div>}
                visible={visible}
                onOk={handleOk}
                afterClose={handleAfterClose} //>=1.16.0
                onCancel={handleCancel}
                closeOnEsc={true}
                footer={
                    <div style={{textAlign:'center'}}>
                        <Button type="primary" onClick={()=>{valte()}}>
                            提交
                        </Button>
                    </div>

                }
            >
                <Row>
                    <Form
                        getFormApi={formApi=>api.current = formApi}
                        onSubmit={values => Toast.info({content: JSON.stringify(values)})}
                    >
                        <>
                            <Row>
                                <Col span={11}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '寝室类别不能为空' },
                                        ]}
                                        onChange={(v)=>{getsexinfo(v)}} field={'sex'} label={"寝室类别"} placeholder="请选择寝室性别" style={{ width: '100%' }} optionList={list}></Form.Select>
                                </Col>
                                <Col span={11} offset={1}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '所属寝室楼不能为空' },
                                        ]}
                                        field={'lid'} label={"所属寝室楼"} placeholder="请选择所属寝室楼" style={{ width: '100%' }} optionList={list5}></Form.Select>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={11}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '寝室规格不能为空' },
                                        ]}
                                        field={'specification'} label={"寝室规格"} placeholder="请选择寝室规格" style={{ width: '100%' }} optionList={list2}></Form.Select>
                                </Col>
                                <Col span={11} offset={1}>
                                    <Form.Input
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'number', message:'请输入正确的寝室号（数字）'  },
                                            { validator: (rule, value) => value != null, message: '寝室号不能为空' },
                                        ]}
                                        label={'寝室号'} field='rid' placeholder='请输入寝室楼号 '/>
                                </Col>
                            </Row>
                            <Row>
                                <Col span={11}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '寝室类型不能为空' },
                                        ]}
                                        field={'type'} label={"寝室类型"} placeholder="请选择寝室类型" style={{ width: '100%' }} optionList={list4}></Form.Select>
                                </Col>
                                <Col span={11} offset={1}>
                                    <Form.Select
                                        rules={[
                                            { required: true, message: '' },
                                            { type: 'string', message: 'type error' },
                                            { validator: (rule, value) => value != null, message: '请选择是否启用' },
                                        ]}
                                        field={'ison'} label={"是否启用"} placeholder="请选择" style={{ width: '100%' }} optionList={list6}></Form.Select>
                                </Col>
                            </Row>
                        </>

                    </Form>
                </Row>
            </Modal>
        </>
    );
}
export default Room_EForm